<template>
    <div class="head">
        <div class="headLeft">
            <Menu mode="horizontal" theme="light" :active-name="activeName" @on-select="goPage">
                <MenuItem v-for="(item ,index) in topList" :key=index :name="item.name">
                    <p class="pill">{{index+1}}</p>
                    {{item.title}}
                </MenuItem>
            </Menu>
        </div>
        <div class="headRight">
            <Input class="ml20" suffix="ios-search" placeholder="搜索" style="width: 150px" />
            <!--下拉-->
            <Dropdown class="role ml20">
                <a href="javascript:void(0)">
                    <Icon type="ios-person-outline" />
                    qiqi
                    <Icon type="ios-arrow-down"></Icon>
                </a>
                <DropdownMenu slot="list">
                    <DropdownItem>个人信息</DropdownItem>
                    <DropdownItem divided>退出</DropdownItem>
                </DropdownMenu>
            </Dropdown>
        </div>
    </div>
</template>
<script>
  export default {
    data() {
      return {
        activeName: "",
        topList: [
          {
            name: "/resManage/newList",
            title: "销售"
          },
          {
            name: "/teaching/market",
            title: "教学"
          },
          {
            name: "/mkt/channelManage",
            title: "市场"
          },
          {
            name: "/finance/market",
            title: "财务"
          }
          ,
          {
            name: "/technology/market",
            title: "技术"
          },
          {
            name: "/data/market",
            title: "数据"
          },
          {
            name: "/infoManage/market",
            title: "信息管理"
          },
          {
            name: "/powerManage/market",
            title: "权限管理"
          }
        ]
      }
    },
    watch: {},
    computed: {},
    mounted() {
      let path = this.$route.path;
      console.log(path);
      this.activeName = path;
    },
    methods: {
      goPage(name) { // 点击菜单进入对应路由
        let app = this
        this.$nextTick(() => {
          app.$router.push(name)
        })
      },
    }
  }

</script>